<template>
  <div class="sample-components-general">
    <a-card title="EUserSearchSelect - 用户选择器" :bordered="false">
      <a
        slot="extra"
        target="_blank"
        href="http://rest-doc.easy-frame.top/front-end/components/data-entry/user-search-select.html">文档地址</a>
      <p>
        根据用户名、昵称、部门名称搜索，选择一个或多个用户
      </p>
      <a-form-model
        ref="form"
        :label-col="FORM_LAYOUT.labelCol"
        :wrapper-col="FORM_LAYOUT.wrapperCol">
        <a-row class="form-row" :gutter="16">
          <a-col :lg="12" :sm="24">
            <a-form-model-item label="单选">
              <e-user-search-select v-model="value1"/>
            </a-form-model-item>
          </a-col>
          <a-col :lg="12" :sm="24">
            <a-form-model-item label="限当前部门">
              <e-user-search-select v-model="value3" range="currentDept"/>
            </a-form-model-item>
          </a-col>
          <a-col :sm="24">
            <a-form-model-item label="多选" :labelCol="FULL_FORM_LAYOUT.labelCol" :wrapperCol="FULL_FORM_LAYOUT.wrapperCol">
              <e-user-search-select v-model="value2" mode="multiple"/>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-card>
  </div>
</template>

<script>
import EUserSearchSelect from '@/components/Easy/data-entry/UserSearchSelect'
import { FORM_LAYOUT, FULL_FORM_LAYOUT } from '@/utils/const/form'

export default {
  name: 'SampleComponentsDataEntryUserSearchSelect',
  components: { EUserSearchSelect },
  data () {
    return {
      FULL_FORM_LAYOUT: FULL_FORM_LAYOUT,
      FORM_LAYOUT: FORM_LAYOUT,

      value1: '1',
      value2: ['1', '0d77057dcae2af878ee7bb336bb2f254'],
      value3: ['1'],
      value4: ['1']
    }
  }
}
</script>

<style scoped>

</style>
